<template>
    <div class="xgp-video" :id="'xgp_video_'+idx">

    </div>
</template>

<script>
import 'xgplayer/dist/index.min.css';
import XgPlayer from 'xgplayer'
import { Events } from 'xgplayer'
export default {
    data() {
        return {
            xPlayer:null
        }
    },
    props: ['src','idx','playIdx'],
    mounted() {
        //this.initPlayer();
    },
    methods:{
        initPlayer(){
            let that=this;
            let player=new XgPlayer({
                id: 'xgp_video_'+this.idx,
                controls: true,
                enableContextmenu:true,
                url: this.src,
                // loop:true,
                lang:'zh',
                volume:1,
                playbackRate:1,
                // fitVideoSize:'auto',
                // poster:that.list[idx].image,
                width: '100%',
                height: '100%',
                // autoplay:true,
                videoInit: true
            })
            this.xPlayer=player;
            // player.on(Events.AUTOPLAY_STARTED,()=>{
            //     debugger
            //     that.$emit('AUTOPLAY_STARTED')
            // })
            // player.on(Events.READY,()=>{
            //     debugger
            //     that.$emit('READY')
            // })
            player.on(Events.ENDED,()=>{
                that.$emit('end')
            })
        }
    }
}
</script>